import { useState, useCallback, useRef } from 'react';

/**
 * 拖拽Hook
 *
 * @returns Hook
 */
const useDrag = () => {
  const [bounds, setBounds] = useState({ left: 0, top: 0, bottom: 0, right: 0 });
  const ref = useRef(null);

  const onStart = useCallback((_event, uiData) => {
    const { clientWidth, clientHeight } = window.document.documentElement;
    const targetRect = ref.current?.getBoundingClientRect();
    if (!targetRect) return;

    setBounds({
      left: -targetRect.left + uiData.x,
      right: clientWidth - (targetRect.right - uiData.x),
      top: -targetRect.top + uiData.y,
      bottom: clientHeight - (targetRect.bottom - uiData.y),
    });
  }, []);

  return [ref, bounds, onStart];
};
export default useDrag;
